<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>All Tasks</title>
  <link rel="stylesheet" href="all.css">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:400,500,600&display=swap">
  
</head>
<body class="all-page">
  <div id="allTaskContainer">
    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:2px;">
      <div></div>
      <button id="widthToggleBtn" title="切换宽度" style="background:none;border:none;padding:0 6px;cursor:pointer;outline:none;font-size:20px;">
        <svg id="widthIcon" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#1677ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="7" width="18" height="10" rx="2"/><path d="M8 7v10M16 7v10"/></svg>
      </button>
    </div>
    <h2 style="text-align:center;">All Tasks</h2>
    <div style="text-align:center;margin-bottom:10px;">
      <a href="tasks.html" id="gotoTasks"  style="color:#1677ff;text-decoration:underline;font-size:13px;">View Task Statistics / Search Page</a>
    </div>
    <div id="statsBar"></div>
    <div id="importExportBar" style="display:flex;justify-content:center;gap:10px;margin-bottom:10px;">
      <button id="exportBtn" style="font-size:12px;padding:2px 10px;">Export</button>
      <button id="importBtn" style="font-size:12px;padding:2px 10px;">Import</button>
      <input type="file" id="importFile" accept=".json" style="display:none;">
    </div>
    <div id="filterBar">
      <label style="font-size:13px;">Done Date:</label>
      <input type="date" id="doneDateStart" placeholder="Start Date">
      <span style="margin:0 4px;">-</span>
      <input type="date" id="doneDateEnd" placeholder="End Date">
      <button id="clearFilterBtn" style="font-size:12px;padding:2px 10px;">Clear</button>
    </div>
    <ul id="allTaskList" class="all-task-list"></ul>
    <div style="margin:18px 0 0 0;text-align:center;">
      <button id="backBtn" style="padding:4px 14px;font-size:13px;">Back</button>
    </div>
  </div>
  <script src="all.js"></script>
</body>
</html> 